<template>
  <div>
    <p>{{ word }}</p>
    <button v-on:click="jokeChange">点击说笑话</button>
  </div>
</template>

<script>
    /*需求：点击按钮,页面内容随机从笑话数组中获取内容展示
        1.事件绑定  v-on:事件类型="methods中声明的事件处理函数名"
        2.在事件处理函数中,随机生成一个笑话数组下标
        3.通过随机生成的下标将数组内容赋值到展示标签
    */
export default {
  data(){
    return {
      word: '这里是一条笑话',
      jokeArr: ['我去相亲网站去了, 那你找到对象了吗? 不! 我找到了他们网站的一个Bug', '讲述一下车怎么翻沟里了。我坐在副驾说沟！沟!沟! 朋友说：欧嘞，欧嘞。欧嘞 结果车就翻里了。', '几位大哥开车去钓鱼，车陷草里了，然后几个大神说把草烧了就出来了，然后就放火烧了，结果就烧没了。']
    }
  },
  methods:{
    jokeChange(){
      let randomIndex= parseInt(Math.random()*this.jokeArr.length)
      this.word = this.jokeArr[randomIndex]
    }
  }
}
</script>